﻿@{
    Layout = "~/Views/Shared/_detail.cshtml";
    if (false)
    {
        <script src="~/LiberUI/Scripts/jquery.js"></script>
        <script src="~/LiberUI/Scripts/LiberUI.Base.js"></script>
        <script src="~/LiberUI/Scripts/LiberUI.js"></script>
        <script src="~/LiberUI/Scripts/LiberUI.Action.js"></script>
    }

}
<title>发货单预览</title>
<script src="/LiberUI/Scripts/jquery.qrcode.min.js"></script>

<div class="row prntHead supplier-info">
    <link href="/SiteUI/Trade/DeliveryBill.css" rel="stylesheet" />
    <img class="dlv-barcode" />
    <img class="cloudLogo" src="/SiteUI/Imgs/logo-txt-little.png" />
    <img class="si-logo" />
    <div class="col-lg-6 col-lg-offset-3 col-sm-6 col-sm-offset-3 col-xs-6 col-xs-offset-3" style="text-align:center">
        <h3 class="si-name"></h3>
        <h5 class="si-conection"></h5>
    </div>
</div>
<br />
<div class="row prntBody order-info">
    <div class="row">
        <div class="col-lg-4 col-sm-4 col-xs-4 DataField">
            <span class="df-title">订单编号</span>
            <span class="df-value di-order"></span>
        </div>
        <div class="col-lg-4 col-sm-4 col-xs-4 DataField">
            <span class="df-title">采购经办</span>
            <span class="df-value oi-clntphone"></span>
        </div>
        <div class="col-lg-4 col-sm-4 col-xs-4 DataField">
            <span class="df-title">送货日期</span>
            <span class="df-value oi-dlvdate"></span>
        </div>
        <div class="col-lg-4 col-sm-4 col-xs-4 DataField">
            <span class="df-title">发货单号</span>
            <span class="df-value di-dlvid"></span>
        </div>
        <div class="col-lg-4 col-sm-4 col-xs-4 DataField">
            <span class="df-title">收货电话</span>
            <span class="df-value oi-consigneephone"></span>
        </div>
        <div class="col-lg-4 col-sm-4 col-xs-4 DataField">
            <span class="df-title">收货人</span>
            <span class="df-value oi-consignee"></span>
        </div>
        <div class="col-lg-4 col-sm-4 col-xs-4 DataField">
            <span class="df-title">客户名称</span>
            <span class="df-value oi-clntname"></span>
        </div>
        <div class="col-lg-8 col-sm-8 col-xs-8 DataField">
            <span class="df-title">送货地址</span>
            <span class="df-value oi-dlvaddress"></span>
        </div>
        <div class="col-lg-4 col-sm-4 col-xs-4 DataField">
            <span class="df-title">施工单位</span>
            <span class="df-value oi-constructor">&nbsp;</span>
        </div>
    </div>
    
    <div class="col-lg-12 col-sm-12 col-xs-12">
        <div style="clear:both"></div>
        <!--发货单明细-->
        <br />
        <div class="FlateSectionHead row expand orderItems">
            <div class="InfoSectionBody col-lg-12">
                <div class="gridtable row classicStyle" id="ordermx-grid">
                    @*<div class="grid-row headrow">
                        <div class="grid-col start" style="width:3%">序</div>
                        <div class="grid-col" style="width:12%;left:3%">名称</div>
                        <div class="grid-col" style="width:10%;left:15%">品牌</div>
                        <div class="grid-col" style="width:20%;left:25%">型号</div>
                        <div class="grid-col" style="width:20%;left:45%">规格</div>
                        <div class="grid-col" style="width:10%;left:65%">订货</div>
                        <div class="grid-col" style="width:9%;left:75%">发货</div>
                        <div class="grid-col" style="width:9%;left:84%">实收</div>
                        <div class="grid-col end" style="width:7%;left:93%">备注</div>
                    </div>
                    <div class="grid-body">
                        <div class="grid-row order-item-tpl">
                            <div class="grid-col start order-item-num" style="width:3%">-</div>
                            <div class="grid-col order-item-product" style="width:12%;left:3%">-</div>
                            <div class="grid-col order-item-brand" style="width:10%;left:15%">-</div>
                            <div class="grid-col order-item-model" style="width:20%;left:25%">-</div>
                            <div class="grid-col order-item-specification" style="width:20%;left:45%">-</div>
                            <div class="grid-col order-item-count" style="width:10%;left:65%"></div>
                            <div class="grid-col order-item-deliveried" style="width:9%;left:75%"></div>
                            <div class="grid-col order-item-receipt" style="width:9%;left:84%"></div>
                            <div class="grid-col end order-item-remark" style="width:7%;left:93%"></div>
                        </div>
                    </div>*@
                </div>
            </div>
        </div>
    </div>
</div>

<div class="row prntFoot">
    <div class="col-lg-3 col-sm-3 col-xs-3">
        送货人：（签名）
    </div>
    <div class="col-lg-3 col-sm-3 col-xs-3">
        收货人：（签名）
    </div>
    <div class="col-lg-3 col-sm-3 col-xs-3">
        领用人：（签名）
    </div>
    <div class="col-lg-3 col-sm-3 col-xs-3 prntPageNum">
    </div>
    <br />
    <div class="col-lg-12 col-sm-12 col-xs-12 billCreateInfo">
        <span class="billCreater">制单人：</span>
        <span class="billCreatetime">制单时间：</span>
        <p>本送货单一式五联，送货单位留一联、收货单位仓库一联、收货单位财务留一联、施工单位留一联、存根一联</p>
        <p class="dlv-memo"></p>
    </div>
</div>
<br />
<div class="row noprnt">
    <div class="col-lg-2 col-lg-offset-10 button" id="btnPrint">打印送货单</div>
</div>

<script>
    var dlvBill = {}
    var ViewDB = {
        tplOrderInfo: null,
        btnDelivery: null,
        GetDeliveryEnd: function (rtn) {
            if (rtn.IsPositive) {
                dlvBill = rtn.Data;
                var order = dlvBill.order;
                if (!order) {
                    window.location = '/Unauthority.html';
                }
                $(".si-logo").attr("src", order.client_logo);
                $(".si-name").vl(order.supplier_realname+"送货单");
                $(".si-conection").vl("电话：" + order.supplier_officephone || "&nbsp;");
                $(".di-order").vl(order.src_orderserial || order.idstr + order.src_orderversion || "&nbsp;");
                $(".di-dlvid").vl(dlvBill.idstr);
                if (order.src_subconstuctor) {
                    order.src_constructor += "(" + order.src_subconstuctor + ")";
                }
                order.constructor = order.src_constructor || "-"

                $(".oi-constructor").vl(order.constructor || "&nbsp;");

                var qr = $('<div>').qrcode({
                    correctLevel: 1,
                    typeNumber: -1,
                    height: $(".dlv-barcode").height(),
                    width: $(".dlv-barcode").height(),
                    text: "https://tlunion.com/Trade/WxDeliveryBillDetail?oid=" + dlvBill.idstr
                });
                $(".dlv-barcode").attr("src", qr.children("canvas")[0].toDataURL());


                $(".oi-clntname").vl(order.client_realname||order.src_client);
                $(".oi-dlvaddress").vl(order.src_dlvaddress || "&nbsp;");
                $(".oi-clntphone").vl(order.buyer_phone || "&nbsp;");
                $(".oi-consigneephone").vl(order.src_consigneephone || order.consignee_phone || "&nbsp;");
                $(".oi-consignee").vl(order.src_consignee || order.consignee_realname || "&nbsp;");
                $(".oi-dlvdate").vl(new Date().toString());


                //#region 处理订单明细
                if (dlvBill.deliverymx) {
                    //var tpl = $(".order-item-tpl").eq(0);
                    //var gridBody = $(".classicStyle").children(".grid-body");
                    //var n = 1;
                    //dlvBill.deliverymx.forEach(function (i) {
                    //    var row = tpl.clone();
                    //    var cols = row.children(".grid-col");
                    //    cols.eq(0).vl(n);
                    //    //cols.eq(1).vl(i.src_code || "-");
                    //    cols.eq(1).vl(i.product);
                    //    cols.eq(2).vl(i.brand);
                    //    cols.eq(3).vl(i.model);
                    //    cols.eq(4).vl(i.src_specification);
                    //    cols.eq(5).vl(i.count + "(" + i.unit + ")");
                    //    cols.eq(6).vl(i.todelivery + "(" + i.unit + ")");
                    //    //cols.eq(7).vl('');
                    //    //cols.eq(8).vl("");
                    //    row.appendTo(gridBody).show();
                    //    i.$row = row;
                    //    n += 1;
                    //});
                    //tpl.remove();
                    var mxTable = new LiberUI.Table("#ordermx-grid");
                    mxTable.Col("序", "3%",false,null,"index")
                           .Col("名称", "12%",false,null,"product")
                           .Col("品牌", "10%",false,null,"brand")
                           .Col("型号", "20%",false,null,"model")
                           .Col("规格", "20%", false, null, "src_specification",null,"order-item-specification")
                           .Col("订货量", "10%", false, null, "_count")
                           .Col("发货", "9%",false,null,"_todelivery")
                           .Col("实收", "9%")
                           .Col("备注", "7%");
                    for (var i = 0; i < dlvBill.deliverymx.length; i++) {
                        dlvBill.deliverymx[i].index = (i+1).toString();
                        dlvBill.deliverymx[i]._count = dlvBill.deliverymx[i].count + "(" + dlvBill.deliverymx[i].unit + ")";
                        dlvBill.deliverymx[i]._todelivery = dlvBill.deliverymx[i].todelivery + "(" + dlvBill.deliverymx[i].unit + ")";
                    }
                    mxTable.vl(dlvBill.deliverymx)
                           .update();
                }
                //#endregion

                $(".billCreatetime").vl("制单时间：" + new Date().format("yyyy-MM-dd hh:mm:ss"));
                $(".dlv-memo").vl(dlvBill.memo?("发货备注："+dlvBill.memo):"");
            }
        },
        prnt: function (pageRows) {
            //TODO:根据模板设定，计算明细项数需要多少张A4页面来打印
            var ps = Math.ceil((dlvBill.deliverymx.length - pageRows) / pageRows + 1);

            var h = $("head")[0].innerHTML;
            var ph = $(".prntHead")[0].innerHTML;
            var pb = $(".prntBody")[0].innerHTML;
            var pf = $(".prntFoot")[0].innerHTML;

            prntWnd = document.createElement('IFRAME');
            $(prntWnd).width(1).height(1);
            document.body.appendChild(prntWnd);
            doc = prntWnd.contentWindow.document;

            //写入固定的页面头信息
            doc.write(h);

            var html = $("<div class='prntPage'>").appendTo("body");
            for (var i = 0; i < ps; i++) {
                html.append(ph);
                html.append(pb);
                html.append(pf);
                html.append("</br>");
                html.find(".gridBody>.gridRow").each(function (ri) {
                    if (i > 0) {
                        if (ri < i * pageRows || ri > ((i + 1) * pageRows)) {
                            this.remove();
                        }
                    }
                    else {
                        if (ri >= pageRows) {
                            this.remove();
                        }
                    }

                });
                html.find(".prntPageNum").vl("页码：[" + (i+1) + "of" + ps+"]");
                doc.write(html[0].outerHTML);
                html.children().remove();
            }
            doc.close();
            html.remove();

            setTimeout(function () {
                prntWnd.contentWindow.print();
                $("body").find("iframe").remove();
            }, 1000);
        }
    }

    $(function () {
        var oid = getUrlParam("oid");
        $.getJSON("/Trade/GetDelivery", { "oid": oid }, ViewDB.GetDeliveryEnd);
        $("#btnPrint").on("click", function () { ViewDB.prnt(18); });
        $("body").on("UserReady", function () {
            $(".billCreater").vl("制单人：" + User.username);
        });
    })
</script>
